﻿<!doctype html>
<html class="no-js">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
    <title>首页</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <meta name="mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="微店铺首页"/>
    <meta name="msapplication-TileColor" content="#090a0a">
    <link rel="stylesheet" href="__ROOT__/static/home/css/home_css.css">
    <link rel="stylesheet" href="__ROOT__/static/plugins/layui/css/layui.css">
    <script type="text/javascript" src="__ROOT__/static/plugins/jquery-3.2.1/jquery-3.2.1.min.js"></script>
    <script type="text/javascript" src="__ROOT__/static/plugins/lazyload/jquery.lazyload.min.js"></script>
    <script type="text/javascript" src="__ROOT__/static/home/js/TouchSlide.1.1.js"></script>
</head>
<body>
<div class="search_header">
    <span class="category_icon"></span>
    <input id="skey" type="text" class="search_input" placeholder="请输入您搜索的关键词"/>
    <i class="search_icon"></i>
</div>
<div id="this_height">&nbsp;</div>


<!--首页轮播图-->
<div id="slideBox" class="slideBox clearfix">
    <div class="bd">
        <ul>
            {volist name='imgs' id='vo'}
            <li>
                <img src="__ROOT__/{$vo.imgs_url}"/>
            </li>
            {/volist}
        </ul>
    </div>
    <div class="hd">
        <ul></ul>
    </div>
</div>
<!--首页导航按钮图标区域-->
<!--后台可控制所以要查数据库输出-->
<div class="shop_navs clearfix">
    <ul>{volist name="msg" id="vo"}
        <li>
            <a href='{:url($vo.operation_msg)}'>
            <div class="shop_navs_out">
                <div><img src="__ROOT__/{$vo.img_url}" alt="x1" /></div>
                <span>{$vo.operation_name}</span>
            </div>
            </a>
        </li>
        {/volist}
        <span id="this_time"></span>
    </ul>
</div>



<!--内容显示区域-->
<div class="tabBox clearfix">
    <!-- 推荐咨询区域-->
    <div class="baby_info clearfix">
        <div class="home_title"><a href="{:url('home/Parenting/index')}"><span class="home_block">&nbsp;</span>&nbsp;推荐咨询<span class="home_gt">»</span></a></div>
        <ul class="ul_left">
            {volist name="knows" id="vo" offset="0" length='3'}
            <a href="{:url('home/Parenting/detailsInfo',array('id'=>$vo.id))}">
                <li>
                    <img class="lazy" data-original="__ROOT__{$vo.img_url}" src="__ROOT__/static/plugins/lazyload/grey.gif" alt="" />
                    <div class="div_describe">
                        <p class="p_max"><small>{$vo.title}</small></p>
                        <p class="p_min"><small>{$vo.content}</small></p>
                    </div>
                </li>
            </a>
            {/volist}
        </ul>
        <ul class="ul_right">
            {volist name="knows" id="vo" offset="3" length='3'}
            <a href="{:url('home/Parenting/detailsInfo',array('id'=>$vo.id))}">
                <li>
                    <img class="lazy" data-original="__ROOT__{$vo.img_url}" src="__ROOT__/static/plugins/lazyload/grey.gif" alt="" />
                    <div class="div_describe">
                        <p class="p_max"><small>{$vo.title}</small></p>
                        <p class="p_min"><small>{$vo.content}</small></p>
                    </div>
                </li>
            </a>
            {/volist}
        </ul>
    </div>
    <!-- 推荐商品区域-->
    <div class="good_info clearfix">
        <div class="home_title"><a href="{:url('home/Shopping/index')}"><span class="home_block">&nbsp;</span>&nbsp;推荐商品<span class="home_gt">»</span></a></div>
        <ul class="ul_left">
            {volist name="specials" id="vo" offset="0" length='3'}
            <!--{$vo|print_r}-->
            <a href="{:url('home/Cart/goodsInfo',array('id'=>$vo.id))}">
                <li>
                    <img class="lazy" data-original="{$vo.goods_url}" src="__ROOT__/static/plugins/lazyload/grey.gif" alt="" />
                    <div class="good_info_name"><span>{$vo.goods_name}</span></div>
                    <div class="div_describe">
                        <p class="p_max">
                            <small style="color: red;">¥{$vo.goods_price}</small>
                        </p>
                        <p class="p_min"><small>{$vo.goods_describe}</small></p>
                    </div>
                </li>
            </a>
            {/volist}
        </ul>
        <ul class="ul_right">
            {volist name="specials" id="vo" offset="3" length='3'}
            <a href="{:url('home/Cart/goodsInfo',array('id'=>$vo.id))}">
                <li>
                    <img class="lazy" data-original="__ROOT__{$vo.goods_url}" src="__ROOT__/static/plugins/lazyload/grey.gif" alt="暂无图片" />
                    <div class="good_info_name"><span>{$vo.goods_name}</span></div>
                    <div class="div_describe">
                        <p class="p_max">
                            <small style="color: red;">¥{$vo.goods_price}</small>
                        </p>
                        <p class="p_min"><small>{$vo.goods_describe}</small></p>
                    </div>
                </li>
            </a>
            {/volist}
        </ul>
    </div>

    <!--育儿知识专栏-->
    <div class="know_info clearfix">
        <div class="home_title"><a href="{:url('home/Babyhome/index')}"><span class="home_block">&nbsp;</span>&nbsp;知识专栏<span class="home_gt">»</span></a></div>
        <ul>
            {volist name="knowsSpecial" id="vo" offset="0" length='6'}
            <!--{$vo|print_r}-->
            <a href="{:url('home/Knows/getKnowsInfo',array('id'=>$vo.id))}">
                <li>
                    <div class="three_left_two">
                        <span class="special_column">专栏</span>
                        <span class="special_info">{$vo.parenting_title}</span>
                        <span class="read_num">阅读 {$vo.count}</span>
                    </div>
                    <div class="three_left_one">
                        <img class="lazy" data-original="__ROOT__{$vo.album_url}" alt="" src="__ROOT__/static/plugins/lazyload/grey.gif" />
                    </div>
                    <div class="clearfix"></div>
                </li>
            </a>
            {/volist}
        </ul>
    </div>
</div>



<div class="back_header" id="back_header" style="display: none;"><img src="__ROOT__/static/home/images/back_header.png" alt=""/></div>




<div style="width: 100%;height:100px;"></div>

<!--底部按钮-->
<div class="footer_fixed clearfix">
    <span><a href="{:url('home/Index/index')}" class="aon"><i class="home_icon"></i><b>首页</b></a></span>
    <span><a href="{:url('home/Community/index')}"><i class="customer_icon"></i><b>社区</b></a></span>
    <span><a href="{:url('home/Shopping/index')}"><i class="store_icon"></i><b>商城</b></a></span>
    <span><a href="{:url('home/Userinfo/index')}"><i class="member_icon"></i><b>个人中心</b></a></span>
</div>
</body>
</html>
<script type="text/javascript" src="__ROOT__/static/home/js/zepto.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("img.lazy").lazyload();
    });


    //轮播图
    $(function(){
        TouchSlide({
            slideCell: "#slideBox",
            titCell: ".hd ul", //开启自动分页 autoPage:true ，此时设置 titCell 为导航元素包裹层
            mainCell: ".bd ul",
            effect: "leftLoop",
            autoPage: true,//自动分页
            autoPlay: true //自动播放
        });
    });

    $(document).ready(function () {
        //首页搜索栏目标随着滚动置顶
        var top = $(".search_header").offset().top;
        $(window).scroll(function () {
            var this_scrollTop = $(this).scrollTop();
            if (this_scrollTop > top) {
                $(".search_header").css('position:fixed; top:0;');
            }
        });

        //返回顶部按钮
        var speed = 1000;//自定义滚动速度
        //动态获取滚动条高度以达到效果
        $(window).scroll(function(){
            var scrollHeight = $(this).scrollTop();
//            console.log(scrollHeight);
            if(scrollHeight>=300){
                $("#back_header").css('display','block');
            }else{
                $("#back_header").css('display','none');
            }
        });
        //回到顶部
        $( "#back_header").click( function () {
            $( "html,body").stop().animate({ "scrollTop" : 0 }, speed);
        });
    });
    //获取当前时间日期
    $(function(){
        var thisDate =new Date();
//        获取当前时间的当前日
        var date=thisDate.getDate();
        if(date<9){
            date = "0"+date;
        }
        $('#this_time').text(date);
    });

</script>